<div class="personal container">
  <div class="personal-informations col-lg-4 col-md-4 col-sm-4 col-xs-12">
    <div class="personal-information">
      <img src="{{headimgurl}}" class="img-circle">
      <p>{{nickname}}</p>
      <p>性别：{{sex | sexPipe}}</p>
      <p>邮箱：{{email}}</p>
      <p>会员到期时间：{{vipDeadline | date: 'y-MM-dd'}}</p>
    </div>
  </div>
  <div class="personal-mains col-lg-8 col-md-8 col-sm-8 col-xs-12">
    <div class="personal-main">
      <div class="nav">
        <ul>
          <li (click)="showTab('mail')" [ngClass]="tabValue == 'mail'? 'checked' : ''">邮箱</li>
          <li (click)="showTab('push')"  [ngClass]="tabValue == 'push'? 'checked' : ''">推送记录</li>
          <li (click)="showTab('security')"  [ngClass]="tabValue == 'security'? 'checked' : ''">安全中心</li>
        </ul>
      </div>
      <!--邮箱-->
      <div class="email table-responsive" *ngIf="tabValue == 'mail'">
        <p>
          <button type="button" class="btn btn-success" (click)="addMail()">添加</button>
        </p>
        <table class="table table-bordered email-table" *ngIf="emailShowStatus=='table'">
          <thead>
          <tr>
            <th class="active">邮箱</th>
            <th class="active">操作</th>
          </tr>
          </thead>
          <tbody>
          <tr *ngFor="let v of emails">
            <td>{{v.mail}}</td>
            <td (click)="deleteMail(v.id)">删除</td>
          </tr>
          </tbody>
        </table>
        <div id="add-mail-box" *ngIf="emailShowStatus=='add'">
          <div class="form-group">
            <label for="exampleInputEmail1">Email地址</label>
            <input type="email" class="form-control" id="exampleInputEmail1" [(ngModel)]="newMailText"
                   placeholder="Email">
          </div>
          <button type="button" class="btn btn-primary" (click)="postNewMail()">保存</button>
        </div>
      </div>
      <!--推送记录-->
      <div class="push" *ngIf="tabValue == 'push'">
        <table class="table table-bordered push-table" *ngIf="emailShowStatus=='table'">
          <thead>
          <tr>
            <th class="active">图书</th>
            <th class="active hidden-xs">邮箱</th>
            <th class="active">状态</th>
          </tr>
          </thead>
          <tbody>
          <tr *ngFor="let p of pushLogs">
            <td>{{p.bookName}}</td>
            <td class="hidden-xs">{{p.mail}}</td>
            <td><p [ngClass]="p.result == 0 ? 'bg-danger':'bg-success'">{{p.result == 0 ? '失败':'成功'}}</p></td>
          </tr>
          </tbody>
        </table>

      </div>

      <div class="security" *ngIf="tabValue == 'security'">
        <div class="security-main">
          <div class="form-group">
            <img src="{{headimgurl}}" class="images img-circle">
          </div>
          <div class="form-group">
            <span>邮箱：</span><input type="email" class="form-control" [(ngModel)]="email" placeholder="邮箱"
                                   required="required" readonly="readonly">
          </div>
          <div class="form-group">
            <span>姓名：</span><input type="text" class="form-control" [(ngModel)]="nickname" placeholder="姓名"
                                   required="required">
          </div>
          <div class="form-group">
            <p>
              <span>性别：</span>
              <input type="radio" [(ngModel)]="sex" id="sex-radio0" name="sex-radio" value="0">保密
              <input type="radio" [(ngModel)]="sex" id="sex-radio1" name="sex-radio" value="1">男
              <input type="radio" [(ngModel)]="sex" id="sex-radio2" name="sex-radio" value="2">女
            </p>
          </div>
          <div class="form-group">
            <span>密码：</span><input type="password" class="form-control" [(ngModel)]="password" placeholder="请输入密码"
                                   required="required">
            <P>不填写或长度小于6将不修改密码</P>
          </div>
          <button type="button" class="btn btn-primary block full-width m-b" (click)="updateUser()">提交</button>

        </div>

      </div>
    </div>
  </div>

  <!--询问框-->
  <div class="popup-box" *ngIf="popupShow == true">
    <div class="popup-box-title">信息</div>
    <div class="popup-box-content">确认删除吗?</div>
    <span class="popup-box-setwin" (click)="Popup(false)">
    <a class="icon-close popup-box-close popup-box-close1"></a></span>
    <div class="popup-box-btn">
      <a class="btn btn-primary btn-sm" (click)="delete()">确定</a>
      <a class="btn btn-danger btn-sm" (click)="Popup(false)">取消</a>
    </div>
    <span class="popup-box-resize"></span>
  </div>
